<template>
  <div>
    <div class="app-container">
      <Card>
        <p slot="title">退货单信息</p>
        <div class="head">
          <div class="head-box">
            <div class="box-item">退货单号：{{ goodsItem.scmRefundId }}</div>
            <div class="box-item">店铺名称：{{ goodsItem.shopName }}</div>
            <div class="box-item">退货总数量：{{ goodsItem.refundQty }}</div>
          </div>
          <div class="head-box">
            <div class="box-item">总金额(元)：￥{{ goodsItem.refundAmt }}</div>
            <div class="box-item">
              创建时间：{{ dateInit(goodsItem.postTime) }}
            </div>
            <div class="box-item">退货原因：{{ goodsItem.refundReason }}</div>
          </div>
          <div class="head-box">
            <div class="box-item">备注：{{ goodsItem.refundNotes }}</div>
          </div>
        </div>
      </Card>
      <Card style="margin-top: 16px">
        <p slot="title">商品明细</p>
        <Table border :columns="columnsSub" :data="dataGrid"></Table>
        <HigPager v-model="query" :total="pageTotal" :init="init"></HigPager>
      </Card>
      <Button class="model_inner_btn" v-if="audit" type="primary" @click="auditConfirm">审核通过</Button>
    </div>
  </div>
</template>
<script>
export default {
  name: "refundInfo",
  data() {
    return {
      dataGrid: [],
      pageTotal: 0,
      columnsSub: [
        {
          title: "商品图片",
          key: "goodsImg",
          width: 100,
          render: (h, params) => {
            return h("div", [
              h(
                "img",
                {
                  attrs: {
                    src: params.row.goodsImg,
                  },
                  style: {
                    width: "50px",
                    height: "46px",
                  },
                },
                "View"
              ),
            ]);
          },
        },
        {
          title: "商品条码",
          key: "eanCode",
          width: 180
        },
        {
          title: "商品名称",
          key: "goodsName",
        },
        {
          title: "供应商",
          key: "supplierOrgName",
        },
        {
          title: "批发价(元)",
          key: "salePrice",
          width: 180,
          sortable: true,
          render: (h, params) => {
            return h("div", [
              h("span", params.row.salePrice.toFixed(2)),
            ]);
          },
        },
        {
          title: "退货数量",
          key: "goodsQty",
          sortable: true,
          width: 150,
        },
        {
          title: "小计金额(元)",
          key: "totalPrice",
          width: 180,
          sortable: true,
          render: (h, params) => {
            return h("div", [
              h("span", params.row.totalPrice.toFixed(2)),
            ]);
          },
        },
      ],
      query: {
        pageIndex: 1,
        pageSize: 15,
        equal: {}
      },
    };
  },
  props: {
    goodsItem: Object,
    audit: Boolean,
    callbank: Function
  },
  methods: {
    dateInit(time) {
      return this.$date(time, "yyyy-MM-dd HH:mm:ss");
    },
    auditConfirm() {
      this.$Modal.confirm({
        title: '温馨提示',
        content: '确认审核通过？',
        onOk: ()=> {
          this.auditSubmit()
        }
      })
    },
    auditSubmit() {
      new this.$rest({
        gateway: 'agrobiz',
        service: "agrobiz-order",
        url: "/v1.0/mall-api/refund/audit/submit",
        data: {
          pojo: {
            scmRefundId: this.goodsItem.scmRefundId,
            shopOrderId: this.goodsItem.shopOrderId,
            refundStatus: 1
          }
        },
        action: (res) => {
          if (res.data.code === 20000) {
            this.callbank()
          } else {
            this.$Message.error(res.data.msg)
          }
        }
      }).post()
    },
    init(id) {
      this.query.equal.scmRefundId = id;
      new this.$rest({
        gateway: 'agrobiz',
        service: "agrobiz-order",
        url: "/v1.0/mall/refund/order/detail/page",
        query: this.query,
        action: (res) => {
          if (res.data.code === 20000) {
            this.dataGrid = res.data.data.list
            this.pageTotal = res.data.data.count
          } else {
            this.$Notice.warning({
              title: "获取失败",
              desc: `失败原因：${res.data.msg}`,
            });
          }
        },
      }).get()
    }
  },
};
</script>
<style lang="less" scoped>
.head {
  width: 100%;
}
.head-box {
  display: flex;
  width: 100%;
  justify-content: space-between;
  height: 30px;
}
.box-item {
  width: 30%;
  display: flex;
  align-items: flex-start;
}
</style>